<template>
  <div style="margin: 20px 300px">
     <el-form ref="student" :model="student" label-width="80px" class="elForm">
        <el-form-item label="班级：">
          <el-select v-model="student.banji" placeholder="请选择班级" @change="getStudentName(student.banji)">
            <el-option :label="stu.name" :value="stu.id" v-for="(stu,index) in banjiData" :key='index'></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="姓名:">
          <el-select v-model="student.name" placeholder="请选择姓名">
            <el-option :label="st.name" :value="st.id" v-for="(st,index) in studentName" :key="index"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="学习内容">
          <el-input type="textarea" v-model="student.content"></el-input>
        </el-form-item>
        <el-form-item label="问题">
          <el-input type="textarea" v-model="student.question"></el-input>
        </el-form-item>
        <el-form-item label="个人总结">
          <el-input type="textarea" v-model="student.summary"></el-input>
        </el-form-item>
        <el-form-item style="margin-left:150px">
          <el-button
           type="primary"
           @click="saveRibaoMsg(student)"
           >保存</el-button>
          <el-button>重置</el-button>
        </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { mapState ,mapActions } from 'vuex'
export default {
  mounted(){
  
  },
  data() {
    return {
      student: {

      }
    }
  },
  methods: {
    ...mapActions(['getStudentName','saveRibaoMsg'])
  },
  computed:{
    ...mapState(['banjiData','studentName'])
  }
}

</script>

<style>
.elForm{
  width: 500px
}
</style>
